<template>
  <a-drawer :title="`运单`" width="70%" :visible="visible"
            hide-cancel
            @cancel="visible = false"
            :footer="false"
            v-if="visible">
    <ma-crud ref="crudRef" :columns="columns" :options="options">
      <template #shipment_no="{ record }">
        <a-link color="blue" @click="">{{ record.shipment.shipment_no }}</a-link>
        <div class="overflow-hidden text-xs line-clamp-2">
          <a-link status="danger" v-if="record.shipment.work_order">
            <template #icon>
              <icon-stop/>
            </template>
            {{record.shipment.work_order.remark}}
          </a-link>
          <a-link status="danger" v-if="record.shipment.work_order && record.shipment.work_order.intercept == 1">
            <template #icon>
              <icon-stop/>
            </template>
            拦截
          </a-link>
        </div> 
      </template>
      <template #tableButtons>
        <router-link :to="goto" target="_blank">
        <a-button type="primary">
            去列表查看
        </a-button>
      </router-link>
      </template>
    </ma-crud>
  </a-drawer>
</template>
<script setup>

import {inject, ref,reactive,watch} from "vue";
import parcel from "@/api/document/parcel.js";
import useShipment from "@/utils/crud/useShipment.js";

const crudRef = ref()
const record = inject('record')
const goto = ref({path:'/document/shipment'})
const visible = defineModel()
let options = ref({})

watch(record, (newVal, oldVal) => {
  if (newVal.id != undefined) {
    options.value = {
        rowSelection: {showCheckedAll: true},
        pageLayout: 'fixed',
        pk: 'id',
        tabs:{
          dataIndex:'cancel',
        },
        api: parcel.getDeliveryList,
        requestParams: {
          delivery_id: record.value.id,
          shipment:1,
        }
      }
  }
},{deep:true,immediate:true})

const columns = reactive([
  {
      title: "单号",
      dataIndex: "shipment_no",
      formType: "input",
      search: true,
  },
  {
      title: "总箱数",
      dataIndex: "shipment.volume_weight.parcel_count",
      formType: "input",
  },
  {
      title: "计划",
      dataIndex: "jihua",
      formType: "input",
  },
  {
      title: "实际箱数",
      dataIndex: "shiji",
      formType: "input",
  },
  {
        title: "状态",
        dataIndex: "cancel",
        formType: "select",
        dict: {
            data:[
              {label:'未扫码',value:1},
              {label:'已扫码',value:2},
              {label:'存疑',value:3},
            ],
            translation: true
        },
        hide:true,
        search:true,
    },
])

</script>